<script setup>
//编译器宏组件
import {ref, watch} from "vue";

const  props=defineProps({
  car: String,
  money:String
})
const shuru=ref([])
const copy=ref("")
const sonMsg=ref("子组件的值")
const emit=defineEmits(['consumeMoney','sendMsg'])//子组件传递事件和参数给父组件
const consume=()=>{
  emit('consumeMoney',50)
}
const sendToFa=()=>{
  emit('sendMsg',sonMsg)
}
watch(["shuru"],(newV)=>{
  copy.value=newV
  console.log(copy.value)
})
</script>

<template>
  <div class="son">我是子组件</div>
  <div class="son">遗产{{car}}</div>
  <div class="son">父亲的遗产{{money}}</div>
  <button class="son" @click="consume">花钱</button>
  <input class="son" placeholder="子组件输入框" v-model="shuru">
  <h3>{{copy}}</h3>
  <button class="son" @click="sendToFa">点击传值给父组件</button>
</template>

<style scoped>
.son{
  border: 1px solid black;
  padding: 30px;
}
</style>
